
<template>
  <div class="set_commission-container">
    <breadcrumb style></breadcrumb>
    <div class="content" id="ry">
      <el-main>
      <div class="box">
      <el-row class="row">
        <el-col :span="6"><div class="grid-content bg-purple">会员积分生效配置</div></el-col>
        <el-col :span="12"><div class="grid-content bg-purple-light"></div></el-col>
      </el-row>
      <el-row class="row1">
        <template>
          <el-col :span="6">
            <div class="grid-content bg-purple">
              确定收货后，第
          <el-input v-model="input" style="width:40px;padding: 0 5px!important;"></el-input>天当天零点，立即生效
          </div>
          </el-col>
 
        </template>
      </el-row>
   </div>
   <div class="box">
       <el-row class="row">
  <el-col :span="6"><div class="grid-content bg-purple">会员积分兑换规则 </div></el-col>
  <el-col :span="12"><div class="grid-content bg-purple-light"></div></el-col>
</el-row>
<el-row class="row1">
  <!-- <el-col :span="1"><div class="grid-content bg-purple">每消费</div></el-col> -->
  <el-col :span="3"><div class="grid-content bg-purple">每消费<el-input v-model="input1" style="width:40px;padding: 0 5px!important;"></el-input>元兑换1积分</div></el-col>
  <!-- <el-col :span="2"><div class="grid-content bg-purple"> 元兑换1积分</div></el-col> -->
</el-row>
   </div>
 <div class="box">
       <el-row class="row">
  <el-col :span="6"><div class="grid-content bg-purple">会员积分过期设置</div></el-col>
  <el-col :span="12"><div class="grid-content bg-purple-light"></div></el-col>
   </el-row>
  <el-row class="row1">
      <template>
           <el-col :span="6"><div class="grid-content bg-purple"> 
             每年12月31日23点59分59秒 清零当年所有的积分
              </div></el-col>
           <!-- <el-col :span="3"><div class="grid-content bg-purple"> </div></el-col> -->
</template>
</el-row>
<el-row class='row1'>
<el-col :span='9' style='fontWeight:400;'>
<div class="grid-content bg-purple font" >
 
   </div>
</el-col>
</el-row>
 
 </div> 
  
       
        <el-footer>
          <el-button type="primary" @click="getSetting">确 定</el-button>
          <el-button style="color: #409eff" @click="$router.go(-1)">取 消</el-button>
        </el-footer>
      </el-main>
    </div>
  </div>
</template>


<script>
import breadcrumb from "../../components/breadcrumb";
export default {
  components: { breadcrumb },
  data() {
    return {
      radio:1,//确认收货
      input:'',//收货小时
      input1:'',//每多少元兑换1积分
      input2:'',//年
      input3:'',//月
      input4:'',//日
      radio1:1,//积分过去设置
      id:'',
      ruy:"",//用于判断是不是第一次
    };
  },
  created() {
   this.getList()
  },
  methods: {
   getSetting(){
      if(!this.ruy){
        var data={
            receGood:this.radio,
            receHour:this.input,
            coin:this.input1*1,
            exceed:this.radio1,
          }
      }else{
        var data={
            receGood:this.radio,
            receHour:this.input,
            coin:this.input1*1,
            exceed:this.radio1,
            id:1
          }
      }
       //console.log(data)
       this.$axios.post('web_point/save',data).then(res=>{
         //console.log(res)
         if(res.data.status==0){
           this.$message({
             type:'success',
             message:'修改成功'
           })
         }
         this.getList()
       })
     
  },
async  getList(){
 const {data:res}=await this.$axios.post('web_point/conf')
 //console.log(res,22)
      this.radio=JSON.stringify(res.data.receGood)
     // //console.log( JSON.stringify(this.radio),'单选框的值')
      this.input2=res.data.exceedTime
      this.radio1=JSON.stringify(res.data.exceed)
      this.input1=res.data.coin
      this.input=res.data.receHour
      this.id=res.data.id

      //用于判断是不是第一次
      this.ruy=res.data.receHour
  },
  //监听单选框事件
  handelt(value){
    //console.log(value)
  },
  //监听收货单选框
  handle(value){
    //console.log(value)
    //this.radio1.value=value
  }
  }
};

</script>



<style lang="less">
.set_commission-container {
  @import "../../style/card.less";
  display: flex;
  flex-flow: column;
  height: 100%;
  .price {
    width: 70px !important;
    .el-input__inner {
      width: 70px !important;
    }
  }
  .el-collapse-item{
      .el-collapse-item__content{
          padding-left: 45px;
          display: flex;
          .el-form{
              width: 310px;
              display: flex;
              flex-direction: column;
              margin-right: 85px;
              .el-form-item{
                  margin-bottom: 30px!important;
              }
          }
      }
  }
  .box{
    // background-color: #eee;
    margin: 20px 0;
  }
  .box>.row{
    font-size: 16px;
    font-weight: 700;
  }
  .box>.row1{
    font-size: 14px;
    // font-weight: 400;
  }
  #ry .box>.row1 .el-input__inner{
    // width: 40px;
    height: 30px;
    padding: 0 6px !important;
  }
  .box>.row span{
    display: inline-block;
    color: red;
  }
   .el-row {

    // margin-bottom: 20px;
    &:last-child {
      margin-bottom: 0;
    }
  }
  .el-col {
   min-width: 110px;
    border-radius: 4px;
  }
  // .bg-purple-dark {
  //   // background: #99a9bf;
  // }
  // .bg-purple {
  //   // background: #d3dce6;
  // }
  // .bg-purple-light {
  //   // background: #e5e9f2;
  // }
  .grid-content {
    border-radius: 4px;
    min-height: 36px;
    line-height: 36px;
    min-width: 40px;
  }
  // .grid-content>.bg-purple>.font{
  //  // font-weight: 700;
  // }
  .row-bg {
    // padding: 10px 0;
    background-color: #f9fafc;
  }
  
}
</style>
